<!DOCTYPE html>
<!-- saved from url=(0032)http://www.bopai.com/web/mobile/ -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="icon" href="http://www.bopai.com/web/img/favicon.png?5890601730" type="image/png"><meta charset="UTF-8">
<title><?php echo C('GLOBAL-TITLE');?></title>
<meta name="description" content="<?php echo C('GLOBAL_DESCRIPTION');?>">
<meta name="keywords" content="<?php echo C('GLOBAL_KEYWORDS');?>">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<link href="<?php echo __CONTENT__;?>/wap/css/1024.css" rel="stylesheet" type="text/css">
<link href="<?php echo __CONTENT__;?>/wap/css/style.css" rel="stylesheet" type="text/css">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta content="telephone=no" name="format-detection">
<script src="<?php echo __CONTENT__;?>/js/jquery.js"></script>
<link href="<?php echo __CONTENT__;?>/wap/css/popup.css" rel="stylesheet" type="text/css">
<link href="<?php echo __CONTENT__;?>/wap/css/order.css" rel="stylesheet" type="text/css">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
</head>
<body style="cursor: auto;">
    <header class="container8 clearfix">
                        <div class="logo column8">
                            <div class="column4 tl">
                            <!--  <a href="http://www.bopai.com/web/mobile/"><img class="logo-img" src="<?php echo __CONTENT__;?>/wap/images/logo.png" alt="爱车保"></a> -->
                            </div>
                            <div class="column4 tr ">
                               <!--  <a href="http://www.bopai.com/web/mobile/account/"><img src="<?php echo __CONTENT__;?>/wap/images/account.png" class="account"></a> -->
                            </div>
                        </div>
                    </header>
    <div class="container8 row mt-20">
        <!--车辆信息-->
        
        <div style="float: left; margin-right: 10px; padding: 0 10px">
            <img src="<?php echo __UPLOAD__;?>/<?php echo $info['car']['thumbnail'];?>">
        </div>
        <div style="text-align: left; line-height: 30px;" id="car_name">
            <h2 style="font-size: 18px;"><?php echo $info['car']['name'];?>&nbsp;<?php echo $info['model']['name'];?></h2>
            <p style="font-size: 16px;"><?php echo $info['name'];?></p>
        </div>

        

        <!--保养项目-->
        <div class="column8 p-5 mt-10">
            <p class="fs-18 tl" style="padding: 0 10px">预约信息</p>
            <p class="fs-15 mt-10 tl" style="padding: 0 10px">欢迎您预约爱车保的上门养车服务，请选择您的预约信息！</p>
        </div>
        <div class="column8 mt-10">
            <ul class="acc-item fs-14 lh-22" id="upkeep_list">
                <?php foreach($info['displacement_project_list'] as $k=>$v){?>
                <li price="<?php echo $v['price'];?>" project_id="<?php echo $v['project_id'];?>" k="<?php echo $k;?>">
                    <img src="<?php echo __UPLOAD__;?>/<?php echo $v['project']['thumbnail'];?>"><br>
                  	<?php echo $v['project']['name'];?>
                </li>
                <?php }?>
                <li class="acc-free">
                    <img src="<?php echo __CONTENT__;?>/wap/images/newsicon4.png">
                    <br>
                    300万责任险
                </li>
            </ul>
        </div>
        <div class="column8 mt-10 fs-14">
            <table border="0" cellpadding="0" id="upkeep_tbl" cellspacing="0" class="acc-tabl lh-30">
                <thead>
                    <tr class="tab">
                        <td width="35%">商品</td>
                        <td>明细</td>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div class="column8 mt-10">
            <p class="fs-18 red" style="text-align: left">
                &nbsp;&nbsp;&nbsp;实付：￥<label id="total_price" class="red">0</label>
            </p>
        </div>
        <form action="#" method="post" >
        	<input type="hidden" name="displacement_id" value="<?php echo $_GET['displacement_id'];?>" />
        	<input type="hidden" name="car_id" value="<?php echo $_GET['car_id'];?>" />
        	<input type="hidden" name="model_id" value="<?php echo $_GET['model_id'];?>" />
        	<input type="hidden" name="project" value="" />
        	<input type="hidden" name="total_price" value="0" />
            <div class="column8 p-5 mt-20">
                <p class="fs-18 tl mt-10" style="clear: both">个人信息</p>
                <p class="fs-15 mt-10 tl">请输入您的真实信息，便于我们为您提供上门保养服务。</p>
                <ul class="o-form" id="user_info">
                    <li>
                        <label class="lbl-red">*</label><input name="name" maxlength="10" value="" type="text" placeholder="姓名：2个汉字以上"></li>
                    <li>
                        <label class="lbl-red">*</label><input name="mobile" maxlength="11" value="" type="text" placeholder="您的手机号"></li>
                    <!--  <li>
                          <label class="lbl-red">*</label><input type="number" id="sms_code" onkeyup="disMobile()" placeholder="验证码" style="width: 43% !important;">  
                          <input type="button" id="sms_btn" onclick="send_sms($(&#39;#subPhone&#39;).val())" class="sms-btn" value="获取验证码" style="width: 130px !important;">          
                    </li> -->
                  
                    <li>
                        <label class="lbl-red">*</label><select autocomplete="off" default_val="0" style="width: 46%; margin-right: 2%;">
                            <option>宁波市</option>
                        </select>
                    </li>
                    <li>
                        <label class="lbl-red">*</label>
                        <input type="text" name="address" value="" maxlength="255" placeholder="详细地址：翠柏路89号">
                    </li>
                    <li id="sad_pnl">服务范围：<label id="sad_1" style="">宁波市区</label></li>
                   	<li>
                        <label class="lbl-red">*</label><select style="width: 30%; margin-right: 2%;" name="month"><option value="-1">选择月份</option></select>
                        <select class="date" style="width: 30%; margin-right: 2%;" autocomplete="off" name="day"><option value="-1">选择日期</option></select>
                        <select class="date" style="width: 28%;" autocomplete="off" id="order_date_pa" name="when">
                        <?php foreach(when() as $k=>$v){?>
                        <option value="<?php echo $k;?>"><?php echo $v;?></option>
                        <?php }?>
                        </select><br>
                    </li>
                    <li>温馨提示：预约时间</li>
                    <li>
                        <span style="float: left; padding-top: 10px;">发票类型：</span>
                        <select name="is_invoice" style="padding-left: 5px;" >
                        	<?php foreach(is_invoice() as $k=>$v){?>
                            <option value="<?php echo $k;?>"><?php echo $v;?></option>
                            <?php }?>
                        </select>
                        <input type="text" data-old="" name="invoice_title" maxlength="255" style="display: none; margin-top: 10px;" placeholder="发票抬头（个人/公司）"></li>
                    <li>
                        <input name="remark" type="text" maxlength="255" autocomplete="off" placeholder="备注">
                    </li>
                   	<li>
                        <font color="red">*预约后请拨打电话13065612247确认您的信息</font>
                    </li>
                    <li>
                        <input type="button" style="background-color: #14a5dc !important;width: 96%;" id="sub_btn" class="btn" value="提交">
                    	<input type="reset" id="reset" style="display:none;" />
                    </li>
                </ul>
            </div>
        </form>
    </div>
    <br>
    <br>
 <script>
$(function(){
	var price=0;
	var displacement_project_list=<?php echo json_encode($info['displacement_project_list']);?>;
	
	$("#upkeep_list li").toggle(function(){
		var project_id=$(this).attr("project_id");
		if(project_id==4&&$("#upkeep_list li[project_id='5']").is(".current")){
			alert('大保养和小保养只能选择一个');
			return false;
		}
		if(project_id==5&&$("#upkeep_list li[project_id='4']").is(".current")){
			alert('大保养和小保养只能选择一个');
			return false;
		}
		if($(this).is(".acc-free")){
			return false;
		}
		if($(this).attr("price")){
			price+=parseInt($(this).attr("price"));
			$("#total_price").html(price);
			$("input[name='total_price']").val(price);
		}
		$(this).addClass("current");
		$(".acc-tabl").show();
		var k=parseInt($(this).attr("k"));
		$(".acc-tabl").find("tbody").append("<tr id='tr-"+k+"'><td class='bl'>"+displacement_project_list[k].project.name+"</td> <td>"+displacement_project_list[k].project.content+"</td></tr>");
	},function(){
		if($(this).attr("price")){
			price-=parseInt($(this).attr("price"));
			$("#total_price").html(price);
			$("input[name='total_price']").val(price);
		}
		$(this).removeClass("current");
		if(price==0){
			$(".acc-tabl").hide();
		}
		var k=parseInt($(this).attr("k"));
		$("#tr-"+k).remove();
	});
	$("select[name='is_invoice']").change(function(){
		if($(this).val()=="0"){
			$("input[name='invoice_title']").hide();
		}else{
			$("input[name='invoice_title']").show();
		}
	});
	$("select[name='is_invoice']").change(function(){
		if($(this).val()==1){
			$("input[name='invoice_title']").show();
		}else{
			$("input[name='invoice_title']").hide();
		}
	});
	
	$("#sub_btn").click(function(){
		var size=$("#upkeep_list li.current").size();
		if(size==0){
			alert('必须选择保养项目');
			return false;
		}
		var project=[];
		$("#upkeep_list li.current").each(function(){
			project.push($(this).attr("project_id"));
		});
		$("input[name='project']").val(project.join(","));
		var data={};
		data.name=$("input[name='name']").val();
		if(data.name.length<2){
			alert('姓名必须大于2个字');
			return false;
		}
		data.mobile=$("input[name='mobile']").val();
		if(!/^(((13[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1}))+\d{8})$/.test(data.mobile)){
			alert('手机格式不正确');
			return false;
		}
		data.address=$("input[name='address']").val();
		if(data.address==""){
			alert('必须填写详细地址');
			return false;
		}
		data.is_invoice=$("select[name='is_invoice']").val();
		if(data.is_invoice==1){
			data.invoice_title=$("input[name='invoice_title']").val();
			if(data.invoice_title==""){
				alert('发票抬头必须填写');
				return false;
			}
		}
		$.post("<?php echo U('save');?>",$("form").serialize(),function(rs){
			if(rs.status==1){
				alert('预约成功');
				$("#reset").click();
			}else{
				alert(rs.msg);
			}
		},'json');
	});
	/**生成月份*/
	var today = new Date();
	var now = today.getDate();
	var year = today.getYear();
	if (year < 2000) year += 1900; // Y2K fix
	var month = today.getMonth();
	var monarr = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
	if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) monarr[1] = "29";
	/* document.write("这个月还剩 " + (monarr[month]-now) + " 天了"); */
	var month_option="";
	var day_option={};
	for(var i=month;i<month+3;i++){
		var val=i%12+1;
		month_option+='<option value="'+val+'">'+val+'月</option>';
		if(i%12==month){
			day_option[val]='';
			for(var j=now+2;j<=monarr[month];j++){
				day_option[val]+='<option value="'+j+'">'+j+'</option>';
			}
		}else{
			for(var j=1;j<=monarr[i%12];j++){
				day_option[val]+='<option value="'+j+'">'+j+'</option>';
			}
		}
	}
	$("select[name='month']").html(month_option).change(function(){
		$("select[name='day']").html(day_option[$(this).val()]);	
	});
	$("select[name='month']").change();
});
 </script>
<footer class="container8">
                        <div class="foot column8">
                            <p>
                               <a href="tel:400-082-0909"><?php echo C('GLOBAL_TEL');?></a><br>
                                服务热线 (免长话费 )<br>
                                服务时间   9:00-18:00<br>
                                热线时间   9:00-18:00
                            </p><br>
                            
                        </div>
                        <div class="foot-b column8"><?php echo C('GLOBAL_COPYRIGHT');?></div>
                    </footer>

</body></html>